{% from 'macros/link/index.xml.njk' import link %}

<text style="section">Text fields</text>
<view style="form-group">
  <text style="label" hide="true" id="id_tf_loading">Loading...</text>
  <view style="field">
    <text-field id="id_tf" name="tf" placeholder="Text field" placeholderTextColor="#8D9494" style="input">
      <behavior trigger="change" action="show" target="id_tf_changed" />
      <behavior trigger="change" action="hide" delay="1000" target="id_tf_changed" />
    </text-field>
    <text style="field-changed" id="id_tf_changed" hide="true">Changed!</text>
  </view>
  <view style="select-container">
    {% call link('Set value to "Test"') -%}
      <behavior action="set-value" new-value="Test" target="id_tf" />
    {%- endcall %}
    {% call link('Clear value') -%}
      <behavior action="set-value" new-value="" target="id_tf" />
    {%- endcall %}
  </view>
</view>
